// ==UserScript==
// @name         Bilibili 专注助手
// @version      1.3.1
// @description  针对 BiliBili PC Web 优化的插件，不再显示推荐（除了视频播放后）
// @author       极寒之梦
// @match        https://www.bilibili.com/video/*
// @require      https://cdn.bootcdn.net/ajax/libs/vue/2.6.9/vue.js
// @run-at       document-end
// @grant        none
// ==/UserScript==

(function () {

	// 分 P 处理模块
	function getMiniTitle(){
		if (!query("#multi_page"))return "";
		if (++window.ScriptRunNumber < 3) query("#multi_page").style.cssText = "height:0px;margin:-12px 0px -6px" ;
		return query("#multi_page .on .part").innerText
	}

	// Tag 处理函数，返回 array
	function getTagListHTML(){
		window.bilibiliTagList = [];
		document.querySelectorAll("#v_tag .tag").forEach(a=>{bilibiliTagList.push(a)})
		return window.bilibiliTagList.map(a=>{return a.innerText})
	}

	let Timer = 0;
	window.addEventListener("load",()=>{
		setTimeout(() => {
			setInterval(() => {
				let re,autoNext
				['#reco_list','.ad-report','#live_recommand_report','#slide_ad'].forEach((qString)=>{
					if(re = document.querySelectorAll(qString)) for(let i = 0; i < re.length; i++)re[i].style.display = 'none';
				})
				if(autoNext = query('.switch-button.on')) autoNext.click();
			}, 1000);
			do{
				window.V = query("video")
			}while(!window.V);
			window.DOMFather = query("#multi_page")
			window.videoTitle = document.title
			let clyzhi_dom_father = document.createElement("div")
			let clyzhi_DOM = document.createElement("div")
			clyzhi_DOM.id = "clyzhi"
			clyzhi_dom_father.id = "clyzhi_dom"
			let styleDOM = document.createElement("style")
			styleDOM.innerHTML = `#multi_page{transition: all 1s;overflow: hidden;transition: all 1s;} .f_left{float:left}.f_right{float:right} .bodycard{padding:1px 4px;max-height: 9rem; overflow-y: auto; border: solid 2px #ccc; border-radius: 4px;} .BiliBiliCardView button{padding:3px} #bilibiliVideoTime{float:right} .BiliBiliCardView .title{ margin:4px; font-size: 1.5rem; border-bottom: 1px #ccc groove;} .BiliBiliCardView{transition: all 1s; margin:10px 0; border-radius:4px; border: 1px #ccc groove; padding: 4px 7px; word-wrap: break-word;} #playerBar{ height:2px; background-color:#6cf; } hr{margin:3px}`
			document.head.appendChild(styleDOM)
			clyzhi_dom_father.appendChild(clyzhi_DOM)
			query(".r-con").appendChild(clyzhi_dom_father);
			
			window.clyzhi = new Vue({
				el:"#clyzhi_dom",data:{
					toolView:false,
						jumpto:0,
						jumpfrom:0,
						ab:false,
					videoNowTime:233*60+33,
					videoAllTime:233*60+33,
						videoUpdataTime:0,
					tagList:getTagListHTML(),
					HavePView:false,
					videoText:query("#v_desc div.info").innerHTML.split("\n").map(a=>{return a.trim()}).join("<br>").trim(),
					PTitle:getMiniTitle(),
					aid:"",bid:"",
					videoTitle:query('.video-title').title,
					PlistButtonText:"展示",
					PlistHeight:0
				},methods:{
					showHidePList(){
						let c = query("#multi_page")
						if(c){
							if(c.clientHeight != 0 && this.PlistHeight == 0)this.PlistHeight = c.clientHeight
							let ba = (c.style["height"] == "0px")
							c.style.cssText = `height:${ba?this.PlistHeight+"px":0};margin:${ba?10:-9}px 0`
							this.PlistButtonText = (this.PlistButtonText =="展开")?"隐藏":"展开"
						}
					},videojump(data){
						V.currentTime = data
					},changeAB(){
						this.ab = (this.jumpto && !this.ab)
					}
				},filters:{
					VideoTimeFilter(m){
						function zero(t){
							return t > 9 ? t : `0${t || 0}`
						}
						let bn = Math.floor(m);
						return `${zero(Math.floor(m / 60))}:${zero(bn % 60)}`;
					},toString(a){
						return (a=="1"?new Date():new Date(a)).toString()
					}
				},computed:{
					VideoTimeBfb(){
						return `${Math.floor(this.videoNowTime/this.videoAllTime*100)}%`
					},day(){
						return Math.floor((new Date().getTime() - this.videoUpdataTime)/1000/60/60/24)
					},hour(){
						return Math.floor((new Date().getTime() - this.videoUpdataTime)/1000/60/60)
					}
				},template:`
		<div>
			<div class="BiliBiliCardView first">
				<div class="title" @click="toolView = true">专注助手<span id="bilibiliVideoTime">{{videoNowTime | VideoTimeFilter}}/{{videoAllTime | VideoTimeFilter}} {{VideoTimeBfb}}</span><div id="playerBar" :style="{width:(videoNowTime/videoAllTime*100)+'%'}"></div></div>
				<h5 v-text="videoTitle"></h5>
				<span>av{{aid}}</span> <span>{{bid}}</span><br>
				<span v-show="HavePView">分P标题：<span id="PTitle" v-text="PTitle" style="display:inline-block">Loading....</span> <button @click="showHidePList">{{PlistButtonText}}列表</button></span>
				<div class="bodycard" v-show="videoText.length>0">
					<span v-html="videoText"></span>
				</div>
			</div>
			<div class="BiliBiliCardView"><div class="title">标签</div>
				<span v-for="tag in tagList" v-text="tag" style="margin: 5px;background: #f4f4f4;border-radius: 100px;padding: 0 12px;position: relative;height: 22px;line-height: 22px;transition: all .3s;font-size: 12px;border: 1px solid #f4f4f4;display:inline-block"></span>
			</div>
			<div class="BiliBiliCardView" v-if="toolView"><div class="title">极寒之梦的工具箱</div>
				<div>
					<span class="f_left">A:{{jumpto|VideoTimeFilter}}</span>
					<span class="f_right">B:{{jumpfrom|VideoTimeFilter}}</span>
				</div>
				<div style="clear:both"></div><button @click="jumpto = videoNowTime">抓取 A 点时间</button><button @click="videojump(jumpto)">跳转到 A 点</button><button @click="jumpfrom = videoNowTime">抓取 B 点</button><button @click="videojump(jumpfrom)">跳转到 B 点</button>
				<button @click="changeAB" title="当视频播放到达或者超过 B 点时跳转到 A 点（自动）">更改自动 A-B 跳转状态 [当前状态:{{ab?"激活":"关闭"}}]</button>
				<hr>
				<div>视频的发布时间：{{videoUpdataTime | toString}}</div>
				<div>计算用系统时间：{{1 | toString}}</div>
				<div>距离视频发布已经：[<span v-text="day"></span> 天，或者 <span v-text="hour"></span> 小时]</div>
				<hr>
				<div>视频分享链接：<span>https://www.bilibili.com/video/av{{aid}}</span></div>
				<div>带跳转时间分享：<span>https://www.bilibili.com/video/av{{aid}}?t={{Math.floor(videoNowTime)}}</span></div>
			</div>
		</div>
`
			})
			clyzhi.showHidePList()
			// 高频刷新进度条
			setInterval(() => {
				Timer++;
				const pt = getMiniTitle()
				let v = clyzhi
				if (Timer == 10) {
					v.PTitle = ( pt || "单视频稿件")
					v.tagList = getTagListHTML()
					v.videoText = query("#v_desc div.info").innerHTML.trim().split("\n").map(a=>{return a.trim()}).join("<br>").trim()
					v.videoTitle = query('.video-title').title
					if(v.videoTitle != window.videoTitle){
						v.ab = false
						v.jumpfrom = 0;
						v.jumpto = 0;
						if(window.videoTitle != "")console.log("bilibili 专注助手：您似乎更换了视频，我们自动停用了 A-B 循环功能")
					}
					v.videoUpdataTime = new Date(query(".video-data > span:nth-child(3)").innerText).getTime()
					window.videoTitle = query('.video-title').title
					v.videoAllTime = V.duration;
					v.aid = window.aid;
					v.bid = window.bvid;
					Timer = 0
					if(v.ab && v.videoNowTime >= v.jumpfrom){
						V.currentTime = v.jumpto
					}
				}
				v.videoNowTime = V.currentTime;
				v.HavePView = (pt != "")
				document.title = `[${V.paused ? '暂停' : '播放'}]${window.videoTitle}`
				let dashang = document.querySelectorAll(".bilibili-player-electric-panel-jump-content")
				if (dashang.length) dashang[0].click();
			}, 100)
		}, 2500);
	})
	function query(q, type = 'select') {
		return (type == 'id') ? document.getElementById(q) : document.querySelector(q)
	}
})();
